<template>
  <de-container class="pa-5">
    <avue-crud
      ref="crud"
      v-model="form"
      :page.sync="page"
      :data="tableData"
      :table-loading="tableLoading"
      :option="tableOption"
      :search.sync="searchForm"
      @on-load="loadListData"
      @search-change="onSearchChange"
      @search-reset="onSearchReset"
      @row-save="onRowSave"
      @row-update="onRowUpdate"
      @row-del="onRowDelete"
      @refresh-change="onRefresh"
      @selection-change="onSelectionChange"
      @filter-change="onFilterChange"
      @sort-change="onSortChange"
    >
      <template slot="menuLeft" slot-scope="{ size }">
        <el-button icon="el-icon-delete" :disabled="selection.length <= 0" :size="size" @click="onBatchDeleteClick">
          批量删除
        </el-button>
      </template>
    </avue-crud>
  </de-container>
</template>

<script>
import {
  requestPostPage,
  requestPostCreate,
  requestPostUpdate,
  requestPostDelete,
  requestPostBatchDelete,
} from '@/api/system/post'
import DeContainer from '@/components/dataease/DeContainer'
import ListMixin from '@/utils/mixins/list-mixin'

export default {
  name: 'PostList',
  components: { DeContainer },
  mixins: [ListMixin],
  data() {
    return {
      listApi: requestPostPage,
      createApi: requestPostCreate,
      updateApi: requestPostUpdate,
      deleteApi: requestPostDelete,
      batchDeleteApi: requestPostBatchDelete,
      tableOption: {
        menuWidth: 200,
        addTitle: '新增岗位',
        editTitle: '编辑岗位',
        viewTitle: '查看岗位',
        searchMenuPosition: 'left',
        column: [
          {
            label: '岗位编号',
            prop: 'postCode',
            rules: [
              {
                required: true,
                message: '请输入岗位编号',
                trigger: 'blur',
              },
              { max: 64, message: '最多64个字' },
            ],
            maxlength: 64,
            showWordLimit: true,
            align: 'left',
          },
          {
            label: '岗位名称',
            prop: 'postName',
            search: true,
            showWordLimit: true,
            maxlength: 24,
            align: 'left',
            rules: [
              {
                required: true,
                message: '请输入岗位名称',
                trigger: 'blur',
              },
              { max: 24, message: '最多24个字' },
            ],
          },
          {
            label: '岗位技能',
            prop: 'postSkill',
            span: 12,
            rules: [
              {
                required: false,
                message: '请输入岗位技能',
                trigger: 'blur',
              },
              { max: 24, message: '最多24个字' },
            ],
            showWordLimit: true,
            maxlength: 24,
            align: 'left',
          },
          {
            label: '岗位排序',
            prop: 'sequence',
            type: 'number',
            rules: [
              {
                required: true,
                message: '请输入岗位排序',
                trigger: 'blur',
              },
            ],
            span: 12,
            align: 'center',
          },
          {
            label: '岗位描述',
            prop: 'description',
            type: 'textarea',
            span: 24,
            maxlength: 200,
            showWordLimit: true,
            hide: true,
          },
        ],
      },
    }
  },
  methods: {},
}
</script>

<style lang="scss"></style>
